<template>
  <div id="vipcheck">
    <el-form :inline="true" :model="vipSearch" class="demo-form-inline">
      <el-form-item label="vip 账号">
        <el-input v-model="vipSearch.number" placeholder="账号"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="onSubmit">查询</el-button>
      </el-form-item>
    </el-form>
    <VIPSearchTable :vipInfoArr = "vipInfoArr" :flag="flag" @handleEdit="handleEdit"></VIPSearchTable>
    <el-row :gutter="20">
      <el-col :span="12" align="center">
        应收: {{checkInfo.total_price}}
      </el-col>
      <el-col :span="12" align="center">
        实收: {{actualRecieve }}
      </el-col>
    </el-row>
  </div>
</template>

<script>
  import VIPSearchTable from './VIPSearchTable';
  import {mapActions} from 'vuex'
  export default {
    name: "VIPCheck",
    components: {
      VIPSearchTable
    },
    props: ['checkInfo'],
    data(){
      return{
        actualRecieve: 0,
        vipSearch: {
          number: '',
        },
        vipInfoArr: [],
        flag: false
      }
    },
    methods: {
      ...mapActions('vipinfo/',['searchVipAC','verifyPass']),
      ...mapActions('bills/',['deleteBill','pay']),
      onSubmit() {
        console.log('onSubmit()',this.vipSearch.number)
        let obj = {
          name: 'null',
          userMember: {
            number: this.vipSearch.number
          }
        }
        this.searchVipAC(obj).then(res => {
          if (res.code === '200') {
            this.vipInfoArr = res.userList
            this.actualRecieve = parseFloat(this.vipInfoArr[0].userMember.discount) * this.checkInfo.total_price * 0.1
          } else if (res.code === '500') {
            this.$message.error('没有相关数据,重新查询')
          }
        })
      },
      handleEdit(index,row) {
        console.log('handleEdit()','扣款',index,row)
        this.$prompt('请输入密码', '提示', {
          confirmButtonText: '结账',
          cancelButtonText: '取消',
          // inputPattern: /[\w!#$%&'*+/=?^_`{|}~-]+(?:\.[\w!#$%&'*+/=?^_`{|}~-]+)*@(?:[\w](?:[\w-]*[\w])?\.)+[\w](?:[\w-]*[\w])?/,
          inputErrorMessage: '',
          inputType: 'password'
        }).then(({ value }) => {
          // 验证 vip 的密码
          let obj = {
            password: value,
            userMember: {
              number: row.userMember.number
            }
          }
          this.verifyPass(obj).then(res => {
            if (res === 'success') {
              console.log(this.checkInfo.orderId)
            
              let params = {
                number: row.userMember.number,
                mainId: this.checkInfo.orderId,
                payType: 1,
                price: this.actualRecieve,
              }
              // 成功后判断账号余额是否大于totalprice 大于等于请求,否则前往充值或者选择其他付款方式
              console.log(params.price,row.userMember.money)
              if (params.price<=row.userMember.money) {
                return this.pay(params)
              } else {
                // 余额不足
                this.$confirm('余额不足,请问是否前往充值?', '提示', {
                  confirmButtonText: '去充值',
                  cancelButtonText: '选择其他付款方式',
                  type: 'warning'
                }).then(() => {
                  //todo: 到充值页面
                  this.$router.push({path: '/vipInfo',query: {userId: row.userMember.number}})
                }).catch(() => {
                  // 切换 tab
                  this.$emit('changetoCommon')
                })
              }
             
            }else {
              this.$message({
                type: 'error',
                message: '密码输入错误,请重新输入'
              })
              
            }
          }).then(res => {
            console.log('付款完毕:',res)
            if (res === 'success') {
              this.$message({
                type: 'success',
                message: '结账成功'
              });
              this.deleteBill(this.checkInfo.seatNumber)
              this.$router.push('/frontHome')
            }
          })
          
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '取消输入'
          });
        });
      }
    }
  }
</script>

<style scoped>

</style>
